{% extends 'base.html' %}

{% block content %}
<div class="container mt-4">
    <h2>结算</h2>
    <div class="row">
        <div class="col-md-8">
            <div class="card mb-4">
                <div class="card-body">
                    <h5 class="card-title">订单商品</h5>
                    <table class="table">
                        <thead>
                            <tr>
                                <th>商品</th>
                                <th>单价</th>
                                <th>数量</th>
                                <th>小计</th>
                            </tr>
                        </thead>
                        <tbody>
                            {% for item in cart_items %}
                            <tr>
                                <td>{{ item.product.name }}</td>
                                <td>¥{{ item.product.price }}</td>
                                <td>{{ item.quantity }}</td>
                                <td>¥{{ item.subtotal }}</td>
                            </tr>
                            {% endfor %}
                        </tbody>
                        <tfoot>
                            <tr>
                                <td colspan="3" class="text-end"><strong>总计：</strong></td>
                                <td><strong>¥{{ cart_items.total }}</strong></td>
                            </tr>
                        </tfoot>
                    </table>
                </div>
            </div>

            <div class="card">
                <div class="card-body">
                    <h5 class="card-title">收货信息</h5>
                    <form method="post">
                        {% csrf_token %}
                        <div class="mb-3">
                            <label for="shipping_address" class="form-label">收货地址</label>
                            <textarea class="form-control" id="shipping_address" name="shipping_address" required></textarea>
                        </div>
                        <div class="mb-3">
                            <label for="contact_phone" class="form-label">联系电话</label>
                            <input type="tel" class="form-control" id="contact_phone" name="contact_phone" required>
                        </div>
                        <button type="submit" class="btn btn-primary">提交订单</button>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}